@use "sass:math";
@import "../../css/variables";

.blog-navbar {
  display: flex;
  align-items: center;
  margin-bottom: $spacer * 2;

  h2 {
    display: inline;
    margin: 0;
    flex: 1;
  }

  ul {
    padding: 0;
    list-style-type: none;
    margin: 0;
    display: inline-flex;
    align-items: center;
    text-transform: uppercase;
    justify-content: flex-end;

    li {
      font-size: $font-size-small;
      font-weight: 400;

      &:not(:first-child) {
        margin-left: $spacer * 2;
      }
    }
  }

  @media (max-width: $sm) {
    flex-direction: column;

    ul {
      margin-top: $spacer;
    }
  }

  .feed-icons {
    display: flex;
    margin-left: $spacer * 1.85;

    svg {
      height: 1.05rem;
      margin-bottom: 3px;
    }

    @media (max-width: $sm) {
      margin-top: math.div($spacer, 2);
    }
  }
}
